<template>
    <div class="table-page-search-wrapper">
        <div class="table-operator">
            <a-button shape="round" v-if="isShowButton" @click="openCommit" type="primary" icon="arrow-up" >提交</a-button>
            <a-button icon="rest" shape="round" v-if="isCancel" @click="cancel" type="danger" >撤销</a-button>
        </div>

        <a-spin :spinning="confirmLoading">
            <LForm ref="taskForm" :formAttributes="formAttributes" :mostColumns="mostColumns" :labelCol="labelCol" :wrapperCol="wrapperCol"></LForm>
        </a-spin>
        <div style="height:30px;"></div>

        <a-tabs default-active-key="1" style="padding-left:10px;">
            <a-tab-pane key="1" tab="审批详情">
                <a-timeline v-if="approvalOpinions.length>0">
                    <a-timeline-item v-for="(opinion,idx) in approvalOpinions" :key="idx">
                        
                        <a-icon v-if="opinion.isPass=='1'" slot="dot" type="check-circle" style="font-size: 16px;" />
                        <a-icon v-else slot="dot" type="close-circle" style="font-size: 16px;" />
                       
                        <a-row>
                            <a-col :span="2">
                                <template v-if="opinion.userAvatar">
                                    <a-avatar size="large" :src="defaultSettings.fileServer+'/'+opinion.userAvatar"></a-avatar>
                                </template>
                                <template v-else>
                                    <a-avatar size="large" :src="require('/src/assets/default_photo.png')"></a-avatar>
                                </template>
                                <div>{{opinion.userName}}</div>
                                
                            </a-col>
                            <a-col :span="22">
                                {{opinion.time}}
                                <div>{{opinion.message}}</div> 
                                <div>
                                    <template v-if="opinion.userSign">
                                        <img style="width:80px;" :src="defaultSettings.fileServer+'/'+opinion.userSign" />
                                    </template>
                                </div>
                            </a-col>
                        
                        </a-row>
                       
                    </a-timeline-item>
                    
                </a-timeline>
            </a-tab-pane>
        </a-tabs>

        <commit-modal ref="commit" @handleOk="commitFlow" @handlerChange="handlerChange"></commit-modal>

        <ExtDrawer ref="ExtDrawer" @close="closeCallback"></ExtDrawer>
        <ExtModal ref="ExtModal" @close="closeCallback" ></ExtModal>
    </div>
</template>

<script>
import LForm from '@/components/lt/form/LForm'
import pick from 'lodash.pick'
import lodash from 'lodash'
import request from '@/utils/request'
import notification from 'ant-design-vue/es/notification'
import commitModal from '@/views/flowable/view/commitModal'
import { Modal } from 'ant-design-vue'
import defaultSettings from '@/config/defaultSettings'
import ExtDrawer from '@/views/system/codeGenerator/ExtDrawer'
import ExtModal from '@/views/system/codeGenerator/ExtModal'
import {SysMixin} from '@/mixins/SysMixin'

export default {
    name: 'assetsScrapApplyTaskForm',
    components: { LForm, commitModal,ExtDrawer,ExtModal},
    mixins:[SysMixin],
    props: {
        componentParam:{
            type:Object,
            default:()=>{}
        }
    },
    data() {
        return {
            initDictCodes:defaultSettings.数据字典.仓库+','+defaultSettings.数据字典.组织下拉树,
            defaultSettings,
            confirmLoading: false,
            isShowButton:true,
            isCancel:false,
            visible:false,
            description:null,//环节说明，用来控制现实内容
            formData: {},
            taskInfo: {},
            mostColumns: 1,
            labelCol: {sm: { span: 6 }},
            wrapperCol: {sm: { span: 18 }},
            cgbLink:'Activity_11fb3vy',
            formAttributes: {
                type:'',
                formItems: [
                    {
                        title:'',
                        columns:1,
                        fields: [
                            {field:'orgNo',label:'单位',component:'treeSelect',disabled:true,rules: [{required: false, message: '不能为空!'}],dictCode:defaultSettings.数据字典.组织下拉树,},
                            {field:'empName',label:'申请人',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'assetNo',label:'资产编号',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'deviceName',label:'设备名称',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'deviceType',label:'设备型号',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'manufacturerName',label:'制造厂名',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'useDate',label:'启用日期',component:'date',disabled:true,rules: [{required: false, message: '不能为空'}]},
                            {field:'originalPrice',label:'原价',component:'input',disabled:true,rules: [{required: false, message: '不能为空!'}]},
                            {field:'applyReason',label:'申请理由',component:'textarea',disabled:true,rules: [{required: false, message: '参数说明不能为空'}]},
                            
                        ]
                    }
                    
                ]
            },
            approvalOpinions:[],
        }
    },
    watch: {
        'componentParam': {
            deep: true,
            immediate: true,
            handler(newV, oldV) {
                if (newV) {
                    this.taskInfo = newV
                    this.formData = {}
                    this.$nextTick(() => {
                        this.$refs['taskForm'].getForm().resetFields()
                        this.getFormData()
                    })
                } else {
                    this.taskInfo = {}
                    this.formData = {}
                    this.$nextTick(() => {
                        this.$refs['taskForm'].getForm().resetFields()
                    })
                }
                
            }
        }
    },
    methods: {
        
        commitFlow(data) {
            let param = {}
            param = Object.assign({}, param, this.formData)
            param.templateId = this.taskInfo.templateId
            param.taskId = this.taskInfo.id
            if (data) {
                param = Object.assign({}, param, data)
            }
            this.confirmLoading = true
            request({url: '/WxAssetsScrapApplyController/commit', method: 'post', data:param}).then(res => {
                if(res.success){
                    this.$message.success(res.message);
                    this.isShowButton = false
                    this.isCancel = false
                } else {
                    notification.error({ message: '系统提示', description: res.message || "执行出现错误"})
                }
            }).finally(() => {
                this.confirmLoading = false
            })
        },
        openCommit() {
            if(!this.taskInfo){
                notification.error({ message: '系统提示', description: "当前任务环节信息不存在"})
                return false
            }
            this.$refs['commit'].open(this.taskInfo,this.formData)
       
        },
        getFormData() {
            this.confirmLoading = true
            request.get('/WxAssetsScrapApplyController/queryByInstanceId',{params:{instanceId: this.taskInfo.procInstId}}).then(res => {
                if(res.success){
                    this.formData = lodash.omit(res.result, 'approvalOpinions')
                    this.$refs['taskForm'].getForm().setFieldsValue(pick(res.result, 'orgNo', 'empName','assetNo', 'deviceName','deviceType','manufacturerName','useDate','originalPrice','applyReason'))
                    
                    this.approvalOpinions = res.result.approvalOpinions
                
                    //显示撤销按钮  || this.taskInfo.taskDefKey==this.cgbLink
                    if(this.formData.empNo==this.taskInfo.assignee){
                        this.isCancel=true
                    }else{
                        this.isCancel=false
                    }

                    this.setDisabled()
                

                } else {
                    notification.error({ message: '系统提示', description: res.message || "执行出现错误"})
                }
            }).finally(() => {
                this.confirmLoading = false
            })
        },
        setDisabled(){

        },
        close() {
            this.visible = false;
            this.$emit('close');
            
        },
        cancel(){
            let that = this
            Modal.confirm({
                title: "系统提醒",
                content: "撤销后数据将被删除，确定撤销?",
                onOk: () => {
                   that.confirmLoading = true
                   request.get('/WxAssetsScrapApplyController/cancel',{params:{instanceId: this.taskInfo.procInstId}}).then((res)=>{
                        if (res.success) {
                            that.isShowButton = false
                            that.isCancel = false
                            that.close()
                            that.$message.success(res.message);
                        } else {
                            that.$message.warning(res.message);
                        }
                    }).finally(() => {
                        that.confirmLoading = false
                        that.setDisabled()
                    })
                },
                onCancel () {}
            })
        },
        handlerChange() {

        }
    }
}
</script>